import React from 'react';
import {Button,Icon,message,Alert} from 'antd'
import {toJS} from 'mobx';
import './style/';
import {WeaTools, WeaDialog, WeaLocaleProvider} from "ecCom";
import Setting_Tab from './Setting_Tab';
const getLabel = WeaLocaleProvider.getLabel;
class Dbgz extends React.Component {

constructor(props) {
    super(props);
    this.state = {viewType:"1",
                  visible:false,
                  showNum:"5",
                  bgColor:"#ffffff",
                  title:"待办工作",
                  isCount:"0",
                  icon:"/spa/portal/images/defaultCustom/dbgz.png",
                  isSys:"1",
                  // options:[],
                  data:[],
                  dbcount:"0",
                  bgTmd:"100",
         }}

    TitleOnChange= (value) => {
        this.setState({title:value});
    }

    ShowNumChnage = (value) => {
    this.setState({showNum: value});
    }

    changeViewType = (value) => {
        this.setState({viewType:value});
    }

    changebgColor = (value) => {
        this.setState({bgColor: value});
    }

    changeCount = (value) => {
        this.setState({isCount:value});
    }

    changeIcon = (value) => {
        this.setState({icon:value});
    }
    changeBgTmd = (value) => {
        this.setState({bgTmd:value});
    }

    getDatas = () => {
        WeaTools.callApi('/api/portal/wfsetting/customwf/getset','GET',{
            "id":this.props.id
        }).then((result) => {

            if(result.api_status==true&&result.isCz==true){
                let bg = result.setting.bgColor.split(',');

             this.setState({title:result.setting.title,
                 showNum:result.setting.shownum,viewType:result.setting.viewtype,
                 bgColor:bg[0],bgTmd:bg[1],icon:result.setting.icon,
                 isSys:result.isSys,
                 // options:result.options,
                 data:result.datas,isCount:result.setting.isCount});
             this.getDBWDS();
            }else if(result.api_status==true&&result.isCz==false){
                this.getDBWDS();
                this.setState({data:result.datas});
            }
        })
    }

    getDBWDS = () =>{
        if(this.state.isCount=="1"){
            WeaTools.callApi('/api/workflow/reqlist/doingCountInfo','POST',{
                "typeids":"1"
            }).then((result) => {
              this.setState({dbcount: result.totalcount.flowNew});
            });
        }
    }

   componentDidMount(){
    this.getDatas();
   }

   onCancel= ()=> {
    this.getDatas();
    this.setState({visible: false});
   }


   urlTiaozhuan = (item) =>{
        const url=item.requestname.link;
        window.open(url);
   }

   moreUrl = () => {
    const more = {"isExclude":"0","perpage":"5","orderby":"","isall":"1","flowCount":0,"flowids":[],"showCopy":"0","viewType":"1","typeids":[],"fromhp":"1","nodeCount":0,"hpwhere":"","typeCount":0,"nodeids":[]}
    window.open("/spa/workflow/index_mobx.jsp#/main/workflow/queryFlowResult?fromwhere=jsonFilter&jsonstr="+escape(JSON.stringify(more)));
   }

   settingDia = () => {
       this.setState({visible:true});
   }

    changeHx = () => {

        let tmd = parseInt(this.state.bgTmd);
        if(tmd=='NaN'){
            tmd = 100;
        }
        const hxtmd = parseInt((tmd/100)*255);

        let temp = hxtmd.toString(16);
        if(hxtmd<10){
            temp ="0"+ temp;
        }
        return temp;

    }

   saveSetting= () =>{

       if(this.state.title==""){
       }else {
           WeaTools.callApi('/api/portal/wfsetting/customwf/saveset','POST',{
               jsonStr: JSON.stringify({"title":this.state.title,
                   "shownum":this.state.showNum,
                   "viewtype":this.state.viewType,
                   "bgColor":this.state.bgColor+","+this.state.bgTmd,
                   "isCount":this.state.isCount,
                   "icon":this.state.icon,
                   "id":this.props.id
               })
           }).then(result => {
               if(result.api_status==true){
                   this.setState({visible:false});
                   message.success(getLabel(83551,"保存成功！"),2);
                   this.getDatas();
               }else {
                   message.error(getLabel(84544,"保存失败！"),2);
               }
           })
       }
   }


    render() {
     const data=this.state.data;
     const {visible,isSys,dbcount,viewType,bgColor,bgTmd} = this.state;
        let isCount = {};
        isCount = {display:"none"};
     if(this.state.isCount!="0"&&viewType=="1"){
         isCount = {};
     }

        const bgcolor = this.state.bgColor+this.changeHx();
        let display ="";
        if(this.props.isSetting==false){
            display="none";
        }
        return (
            <div className="portal-com-dbgz" style={{"background-color":bgcolor}}>
                <Icon  className="dbgz-setting-icon" onClick={this.settingDia} type="setting" theme="filled" style={{"display":display}}/>
                <div className="portal-com-dbgz-count" style={isCount}>{dbcount}</div>
                <div className="portal-com-dbgz-content">
                    <div className="portal-com-dbgz-header">
                        <img  style={{width:50,height:50,float:"left"}} src={this.state.icon} />
                        <span className="portal-com-dbgz-title" style={{ width: 100, height: 50,
                           "line-height": 50,
                            display: "inline-block","cursor": "pointer"}}>{this.state.title}</span>

                        <span className="portal-com-dbgz-more"   style={{"font-size":12}} >

                            <span onClick={this.moreUrl}>{getLabel(385419,"更多>>")}</span></span>
                    </div>
                    {
                        data.length>0 ? (
                        <div className="portal-com-dbgz-data">
                            <ul>
                                {
                                    data.map((item) => {
                                        return (
                                            <li>
                                                <span className="portal-com-dbgz-title"
                                                      onClick={() => this.urlTiaozhuan(item)}
                                                      title={item.requestname.name}>{item.requestname.name}</span>
                                            </li>
                                        );
                                    })
                                }
                            </ul>
                        </div>
                        ):(
                            <div className="portal-com-dbgz-data">
                                <ul style={{"font-size":"large"}}>
                                    {getLabel(83553,"暂无数据")}
                                </ul>
                            </div>
                        )
                    }
                </div>
                <WeaDialog visible={visible} onCancel={this.onCancel} title={getLabel(30747,"设置")}>
                    <div style={{position:"relative",height:400}}>
                        <Setting_Tab  titleChange={this.TitleOnChange}  ShowNumChnage={this.ShowNumChnage}  changeBgTmd={this.changeBgTmd} changeViewType={this.changeViewType} changebgColor={this.changebgColor} changeCount={this.changeCount} changeIcon={this.changeIcon} settingInfo={this.state} />
                        <div style={{position:"absolute",bottom:7,"margin-left": "67%"}}>
                            <Button onClick={this.saveSetting} type="primary">{getLabel(33703,"确认")}</Button>
                            <Button onClick={this.onCancel} style={{"margin-left":10}}>{getLabel(31129,"取消")}</Button>
                        </div>
                    </div>
                </WeaDialog>
            </div>
        );
    }
}

export default Dbgz;